<template>
  <div>
    <a-spin :spinning="loading">
      <a-form-model
        ref="ruleForm"
        :model="form"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
      >
        <a-form-model-item label="新资源点击间隔">
          <a-select style="width:200px" v-model="form.receive_click_interval" placeholder="设置领取资源点击间隔">
            <a-select-option v-for="item in intervalOpts" :key="item.value" :value="item.value">{{item.label}}</a-select-option>
          </a-select>
          <template slot="help">技术部综合服务器负载考虑后，推荐5秒</template>
        </a-form-model-item>
        <a-form-model-item label="共享源点击间隔">
          <a-select style="width:200px" v-model="form.receive_old_click_interval" placeholder="设置领取资源点击间隔">
            <a-select-option v-for="item in intervalOpts" :key="item.value" :value="item.value">{{item.label}}</a-select-option>
          </a-select>
          <template slot="help">技术部综合服务器负载考虑后，推荐5秒</template>
        </a-form-model-item>
        <a-form-model-item label="专利类顾问资源上限">
          <a-input-number v-model="form.receive_resources_limit_zl" />
          <template slot="help">已成单客户不计入资源上限</template>
        </a-form-model-item>
        <a-form-model-item label="商标类顾问资源上限">
          <a-input-number v-model="form.receive_resources_limit_tm" />
          <template slot="help">已成单客户不计入资源上限</template>
        </a-form-model-item>
        <a-form-model-item label="资源入库时间">
          <a-select v-model="form.receive_time_interval3" style="width:200px" placeholder="选择资源入库时间">
            <a-select-option v-for="(item, index) in yearOpts" :key="item" :value="item">{{index}}</a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="是否可以领取资源" prop="receive_enable">
          <a-radio-group v-model="form.receive_enable">
            <a-radio-button :value="'1'">
              是
            </a-radio-button>
            <a-radio-button :value="'0'">
              否
            </a-radio-button>
          </a-radio-group>
        </a-form-model-item>
        <a-form-model-item label="可领取资源的上限" prop="receive_resources_limit">
          <a-input-number
            v-model="form.receive_resources_limit"
            help="默认：300"
          />
        </a-form-model-item>
        <a-form-model-item label="领取新资源时间间隔" prop="receive_time_interval">
          <a-input-number
            readonly
            v-model="form.receive_time_interval"
            :formatter="value => `${value}分`"
            :parser="value => value.replace('分', '')"
          />
        </a-form-model-item>
        <a-form-model-item label="昨日微信添加最低数量" prop="receive_yesterday_wx_num">
          <a-input-number v-model="form.receive_yesterday_wx_num" />
        </a-form-model-item>
        <a-form-model-item label="昨日拨通电话最低时长" prop="receive_time_yesterday_phone">
          <a-input-number
            readonly
            v-model="form.receive_time_yesterday_phone"
            :formatter="value => `${value}分`"
            :parser="value => value.replace('分', '')"
          />
        </a-form-model-item>
        <a-form-model-item label="资源被放弃多久后可以再次被领取" prop="receive_time_interval2">
          <a-input-number v-model="form.receive_time_interval2" />
        </a-form-model-item>
        <a-form-model-item label="每天领取新资源开始时间" prop="receive_start_time">
          <a-time-picker :value="moment(startTime, 'HH:mm:ss')" format="HH:mm:ss" @change="onChangeStart"/>
        </a-form-model-item>
        <a-form-model-item label="每天领取资源的结束时间" prop="receive_end_time">
          <a-time-picker :value="moment(endTime, 'HH:mm:ss')" format="HH:mm:ss" @change="onChangeEnd"/>
        </a-form-model-item>
        <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
          <a-button type="primary" @click="onSubmit">
            保存更改
          </a-button>
          <a-button style="margin-left: 10px;" @click="resetForm">
            重置内容
          </a-button>
        </a-form-model-item>
      </a-form-model>
    </a-spin>
  </div>
</template>

<script>
import moment from 'moment'
import { getReceiveSetting, postReceiveSetting } from '@/api/receive'

export default {
  name: 'BaseSetting',
  data () {
    return {
      labelCol: { span: 4 },
      wrapperCol: { span: 14 },
      startTime: '',
      endTime: '',
      form: {},
      loading: true,
      dateFormat: 'HH:mm:ss',
      yearOpts: {},
      intervalOpts: {}
    }
  },
  created () {
    this.getSettingInfo()
  },
  methods: {
    moment,
    getSettingInfo () {
      this.loading = true
      getReceiveSetting().then(res => {
        if (res.status === 0) {
          this.form = res.result.receive_setting
          this.startTime = res.result.receive_setting.receive_start_time
          this.endTime = res.result.receive_setting.receive_end_time
          this.yearOpts = res.result.yearOpts
          this.intervalOpts = res.result.clickIntervalOpts
          this.loading = false
        }
      })
    },
    resetForm () {
      this.$refs.ruleForm.resetFields()
    },
    onChangeStart (time, timeString) {
      this.startTime = timeString
    },
    onChangeEnd (time, timeString) {
      this.endTime = timeString
    },
    onSubmit () {
      const app = this
      app.$refs.ruleForm.validate(valid => {
        if (valid) {
          const setting = {}
          for (const k in app.form) {
            setting['receive_setting[' + k + ']'] = app.form[k]
          }
          setting['receive_setting[receive_start_time]'] = this.startTime
          setting['receive_setting[receive_end_time]'] = this.endTime
          postReceiveSetting(setting).then(res => {
            if (res.status === 0) {
              app.getSettingInfo()
            } else {
              app.$warning({
                title: res.msg
              })
            }
          })
        } else {
          return false
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
